<template>
  <el-container>
    <el-main>
      <el-form ref="updateForm" size="small" :model="parmsValue" label-width="160px" :rules="form.rules" class="middle-form">
        <el-row>
          <el-col :span="12">
            <el-form-item prop="subs_bdate" label="认购起始日期">
              <el-date-picker v-model="parmsValue.subs_bdate" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="set_zsrgdate" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="subs_begin_time" label="认购起始时间">
              <el-time-picker v-model="parmsValue.subs_begin_time" format="HH:mm:ss" value-format="HHmmss" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="subs_edate" label="认购结束日期">
              <el-date-picker v-model="parmsValue.subs_edate" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="changeenddate" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="subs_end_time" label="认购结束时间">
              <el-time-picker v-model="parmsValue.subs_end_time" format="HH:mm:ss" value-format="HHmmss" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="establish_date" label="产品起始日期(中债)">
              <el-date-picker v-model="parmsValue.establish_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="calProdDays" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="start_fee_date" label="收益起始日期">
              <el-date-picker v-model="parmsValue.start_fee_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="calProdDays" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="open_begin_date" label="开放起始日期">
              <el-date-picker v-model="parmsValue.open_begin_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="begindatechange" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="open_begin_time" label="开放起始时间">
              <el-time-picker v-model="parmsValue.open_begin_time" format="HH:mm:ss" value-format="HHmmss" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="open_end_date" label="开放结束日期">
              <el-date-picker v-model="parmsValue.open_end_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="enddatechange" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="open_end_time" label="开放结束时间">
              <el-time-picker v-model="parmsValue.open_end_time" format="HH:mm:ss" value-format="HHmmss" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="end_date" label="产品终止日期(中债)">
              <el-date-picker v-model="parmsValue.end_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" @change="calProdDays" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="pay_date" label="兑付日期">
              <el-date-picker v-model="parmsValue.pay_date" format="yyyy-MM-dd" value-format="yyyyMMdd" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="prod_days" label="产品天数">
              <el-input v-model.number="parmsValue.prod_days" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="prod_cycle" label="产品期限(中债)">
              <el-select v-model="parmsValue.prod_cycle" :clearable="true" :disabled="detailMod">
                <el-option v-for="(item,index) in dict.t8_zhz_prod_cycle" :key="index" :value="index" :label="item" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="subs_date" label="申购确认日N值">
              <el-select v-model="parmsValue.subs_date" :clearable="true" :disabled="detailMod" @change="YzProdDays">
                <el-option v-for="(item,index) in dict.t8_clearing_prod_speed" :key="index" :value="index" :label="item" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="redeem_date" label="赎回确认日N值">
              <el-select v-model="parmsValue.redeem_date" :clearable="true" :disabled="detailMod" @change="YzProdDays">
                <el-option v-for="(item,index) in dict.t8_clearing_prod_speed" :key="index" :value="index" :label="item" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="renge_mode" label="头尾算法">
              <el-select v-model="parmsValue.renge_mode" :clearable="true" :disabled="detailMod">
                <el-option v-for="(item,index) in dict.t8_renge_mode" :key="index" :value="index" :label="item" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            发行机构代码
          </el-col>
        </el-row>
        <!--        <div class="k-field">-->
        <!--          <label class="k-field-label">发行机构代码（中债）</label>-->
        <!--          <input-->
        <!--            type="text"-->
        <!--            class="form-control k-field-tree"-->
        <!--            name="orgno"-->
        <!--            placeholder=""-->
        <!--            data-exeid="prodinfoES_007"-->
        <!--            data-max-length="20"-->
        <!--            data-display-field="orgno,orgname"-->
        <!--            data-select-branch="true"-->
        <!--            data-allowblank="false"-->
        <!--          >-->
        <!--        </div>-->
        <el-row>
          <el-col :span="12">
            <el-form-item prop="invest_object" label="投资者类型(中债)">
              <el-select v-model="parmsValue.invest_object" :clearable="true" :disabled="detailMod" @change="objectChange">
                <el-option v-for="(item,index) in dict.t8_sale_oside" :key="index" :value="index" :label="item" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="min_subs_p" label="认购起点金额(元/个人)">
              <el-input v-model="parmsValue.min_subs_p" :clearable="true" :disabled="detailMod" @blur="minsubspChange" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_subs_p" label="认购递增金额(元/个人)">
              <el-input v-model="parmsValue.step_subs_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="min_append_p" label="认购追加起点(元/个人)">
              <el-input v-model="parmsValue.min_append_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="max_subs_p" label="认购最高金额(元/个人)">
              <el-input v-model="parmsValue.max_subs_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="min_pchs_p" label="单笔申购起点金额(元/个人)">
              <el-input v-model="parmsValue.min_pchs_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_pchs_p" label="单笔申购递增金额(元/个人)">
              <el-input v-model="parmsValue.step_pchs_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="min_hold_p" label="最低持有份额(份/个人)">
              <el-input v-model="parmsValue.min_hold_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="min_redeem_p" label="单笔赎回最低份额(份/个人)">
              <el-input v-model="parmsValue.min_redeem_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_redeem_p" label="单笔赎回递增份额(份/个人)">
              <el-input v-model="parmsValue.step_redeem_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="max_buy_p" label="累计购买金额上限(元/个人)">
              <el-input v-model="parmsValue.max_buy_p" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="min_subs_m" label="认购起点金额(元/机构)">
              <el-input v-model="parmsValue.min_subs_m" :clearable="true" :disabled="detailMod" @blur="minsubsmChange" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_subs_m" label="认购递增金额(元/机构)">
              <el-input v-model="parmsValue.step_subs_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="min_append_m" label="机构追加起点(元/机构)">
              <el-input v-model="parmsValue.min_append_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="max_subs_m" label="认购最高金额(元/机构)">
              <el-input v-model="parmsValue.max_subs_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="max_buy_m" label="累计购买金额上限(元/机构)">
              <el-input v-model="parmsValue.max_buy_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8" />
        </el-row>
        <div class="form-line" />
        <el-row>
          <el-col :span="8">
            <el-form-item prop="min_pchs_m" label="单笔申购起点金额(元/机构)">
              <el-input v-model="parmsValue.min_pchs_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_pchs_m" label="单笔申购递增金额(元/机构)">
              <el-input v-model="parmsValue.step_pchs_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="min_hold_m" label="最低持有份额(份/机构)">
              <el-input v-model="parmsValue.min_hold_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="min_redeem_m" label="单笔赎回最低份额(份/机构)">
              <el-input v-model="parmsValue.min_redeem_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="step_redeem_m" label="单笔赎回递增份额">
              <el-input v-model="parmsValue.step_redeem_m" :clearable="true" :disabled="detailMod" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-main>
  </el-container>
</template>

<script>
  import request from '@/utils/request'
  import axios from 'axios'
  import { formItems } from '@/utils/formItems'

  export default {
    props: {
      editMod: {
        type: String,
        default: 'ADD'
      },
      parmsValue: {
        type: Object,
        default: () => {
          return {
            subs_bdate: '',
            subs_begin_time: '',
            subs_edate: '',
            subs_end_time: '',
            establish_date: '',
            start_fee_date: '',
            open_begin_date: '',
            open_begin_time: '',
            open_end_date: '',
            open_end_time: '',
            end_date: '',
            pay_date: '',
            prod_days: '',
            prod_cycle: '',
            subs_date: '',
            redeem_date: '',
            renge_mode: '',
            invest_object: '',
            min_subs_p: '',
            step_subs_p: '',
            min_append_p: '',
            max_subs_p: '',
            min_pchs_p: '',
            step_pchs_p: '',
            min_hold_p: '',
            min_redeem_p: '',
            step_redeem_p: '',
            max_buy_p: '',
            min_subs_m: '',
            step_subs_m: '',
            min_append_m: '',
            max_subs_m: '',
            max_buy_m: '',
            min_pchs_m: '',
            step_pchs_m: '',
            min_hold_m: '',
            min_redeem_m: '',
            step_redeem_m: ''
          }
        }
      }
    },
    data() {
      return {
        dict: {
          t8_zhz_prod_cycle: {},
          t8_clearing_prod_speed: {},
          t8_renge_mode: {},
          t8_sale_oside: {}
        },
        form: {
          rules: {
            subs_bdate: [{ required: true, message: '认购起始日期必填', trigger: 'change' }],
            subs_begin_time: [{ required: true, message: '认购起始时间必填', trigger: 'change' }],
            subs_edate: [{ required: true, message: '认购结束日期必填', trigger: 'change' }],
            subs_end_time: [{ required: true, message: '认购结束时间必填', trigger: 'change' }],
            establish_date: [{ required: true, message: '产品起始日期必填', trigger: 'change' }],
            start_fee_date: [{ required: true, message: '收益起始日期必填', trigger: 'change' }],
            open_begin_date: [{ required: true, message: '开放起始日期必填', trigger: 'change' }],
            open_begin_time: [{ required: true, message: '开放起始时间必填', trigger: 'change' }],
            open_end_date: [{ required: true, message: '开放结束日期必填', trigger: 'change' }],
            open_end_time: [{ required: true, message: '开放结束时间必填', trigger: 'change' }],
            end_date: [{ required: true, message: '产品终止日期必填', trigger: 'change' }],
            pay_date: [{ required: true, message: '兑付日期必填', trigger: 'change' }],
            prod_days: [{ required: true, message: '产品天数必填', trigger: 'change' }],
            prod_cycle: [{ required: true, message: '产品期限必填', trigger: 'change' }],
            subs_date: [{ required: true, message: '申购确认日N值必填', trigger: 'change' }],
            redeem_date: [{ required: true, message: '赎回确认日N值必填', trigger: 'change' }],
            renge_mode: [{ required: true, message: '头尾算法必填', trigger: 'change' }],
            invest_object: [{ required: true, message: '投资者类型必填', trigger: 'change' }],
            min_subs_p: [{ required: true, message: '认购起点金额必填', trigger: 'change' }],
            step_subs_p: [{ required: true, message: '认购递增金额必填', trigger: 'change' }],
            min_append_p: [{ required: true, message: '认购追加起点必填', trigger: 'change' }],
            max_subs_p: [{ required: true, message: '认购最高金额必填', trigger: 'change' }],
            min_pchs_p: [{ required: true, message: '单笔申购起点金额必填', trigger: 'change' }],
            step_pchs_p: [{ required: true, message: '单笔申购递增金额必填', trigger: 'change' }],
            min_hold_p: [{ required: true, message: '最低持有份额必填', trigger: 'change' }],
            min_redeem_p: [{ required: true, message: '单笔赎回最低份额必填', trigger: 'change' }],
            step_redeem_p: [{ required: true, message: '单笔赎回递增份额必填', trigger: 'change' }],
            max_buy_p: [{ required: true, message: '累计购买金额上限必填', trigger: 'change' }],
            min_subs_m: [{ required: true, message: '认购起点金额必填', trigger: 'change' }],
            step_subs_m: [{ required: true, message: '认购递增金额必填', trigger: 'change' }],
            min_append_m: [{ required: true, message: '机构追加起点必填', trigger: 'change' }],
            max_subs_m: [{ required: true, message: '认购最高金额必填', trigger: 'change' }],
            max_buy_m: [{ required: true, message: '累计购买金额上限必填', trigger: 'change' }],
            min_pchs_m: [{ required: true, message: '单笔申购起点金额必填', trigger: 'change' }],
            step_pchs_m: [{ required: true, message: '单笔申购递增金额必填', trigger: 'change' }],
            min_hold_m: [{ required: true, message: '最低持有份额必填', trigger: 'change' }],
            min_redeem_m: [{ required: true, message: '单笔赎回最低份额必填', trigger: 'change' }],
            step_redeem_m: [{ required: true, message: '单笔赎回递增份额必填', trigger: 'change' }]
          }
        }
      }
    },
    computed: {
      updateMod() {
        return this.editMod === 'update'
      },
      detailMod() {
        return this.editMod === 'detail'
      },
      addMod() {
        return this.editMod === 'add'
      }
    },
    // 生命周期开始
    // 生命周期结束
    methods: {
      /**
       *
       * 初始化数据，用于数据字典的获取，页面进入时调用一次，常为保持请求同步而在数据字典请求回调后请求表格数据等
       *
       **/
      init() {
        /**
         * dict类型数据字典获取
         **/
        const dictReq = []
        const dicts = ['t8_zhz_prod_cycle', 't8_clearing_prod_speed', 't8_renge_mode', 't8_sale_oside']
        dicts.forEach(key => dictReq.push(request({ url: 'system/base/dict/' + key + '.json', method: 'post', loading: true })))
        axios.all(dictReq).then(axios.spread((...item) => {
          for (let i = 0; i < dicts.length; i++) {
            this.dict[dicts[i]] = item[i]
          }
        }))
      },
      YzProdDays() {

      },
      objectChange() {

      },
      set_zsrgdate() {},
      changeenddate() {},
      calProdDays() {},
      begindatechange() {},
      enddatechange() {},
      minsubspChange() {},
      minsubsmChange() {}
    }
  }
</script>
